let $ = layui.$;
export default class Admin {
    constructor() {
        this.render()
        this.handel()
    }
    render() {
        let template = `
            <style>
            body {
                background-color: #c2c2c2;
            }
            .layui-card {
                margin: 50px auto 0;
                width: 520px;
                padding: 20px;
            }
    
            .layui-card-header {
                text-align: center;
                font-size: 26px;
                font-weight: bold;
            }
            .card{
                margin-top:200px;
            }
        </style>
            <div class="layui-card card">
            <div class="layui-card-header">登录</div>
            <form class="layui-form" action="" lay-filter="example">
                <div class="layui-form-item">
                    <label class="layui-form-label">用户名</label>
                    <div class="layui-input-block">
                        <input type="text" id="username" name="username" required lay-verify="required" autocomplete="off" placeholder="请输入用户名" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-block">
                        <input type="password" id="pwd" name="pwd" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formDemo">登陆</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
        `
        $('#root').html(template)
    };
    handel() {
        let form = layui.form;
        form.on('submit(formDemo)', function (data) {
            // console.log(data);
            $.ajax({
                type: "post",
                url: "/api/users/admin",
                data: data.field,
                success(res) {
                    console.log(res);
                    if (Object.keys(res).length > 0) {
                        alert('登录成功');
                        //将返回的token信息保存在localStorage里
                        layui.data('tokens', {
                            key: 'token',
                            value: res.token
                        })
                        window.location = '#manage'
                    } else {
                        alert('登录失败');
                    }
                }
            });
            return false;
        });
    }
}




 
